import React, { Component } from 'react';
import { Modal, Row, Col, Form, Select, Checkbox, Button } from 'antd'
const { Option } = Select
export default class CuiFu extends Component {
    constructor() {
        super()
        this.state = {
            visible: false
        }
    }
    componentDidMount() {
    }
    handleOk = () => { }
    handleCancel = () => { }
    onFinish = () => { }
    open = () => {
        this.setState({
            visible: true
        })
    }
    render() {
        const { visible } = this.state
        const formItemLayout = {
            labelCol: {
                span: 6,
            },
            wrapperCol: {
                span: 14,
            },
        };
        return (
            <Modal title="催付" visible={visible} onOk={this.handleOk} onCancel={this.handleCancel}>
                <Form
                    name="validate_other"
                    {...formItemLayout}
                    onFinish={this.onFinish}
                    initialValues={{

                    }}
                >
                    <Form.Item
                        name="txt"
                        label=""
                        rules={[
                            {
                                required: true,
                                message: '请选择模板',
                                type: 'array',
                            },
                        ]}
                    >
                        <Select placeholder="请选择模板">
                            <Option value="1">尊敬的用户您好，您有一笔订单未支付，请尽快处理！</Option>
                            <Option value="2">尊敬的【用户昵称】您好，您有哈奇马订单尚未支付，价格实惠不容错过哦~</Option>
                            <Option value="3">尊敬的【用户昵称】您好，您的订单【订单ID】，【商品名称】即将自动取消，请尽快支付哦~</Option>
                        </Select>
                    </Form.Item>

                    <Form.Item name="msg" label="">
                        <Checkbox.Group>
                            <Row>
                                <Col span={8}>
                                    <Checkbox
                                        value="1"
                                        style={{
                                            lineHeight: '32px',
                                        }}
                                    >
                                        站内信消息
                                    </Checkbox>
                                </Col>
                                <Col span={8}>
                                    <Checkbox
                                        value="2"
                                        style={{
                                            lineHeight: '32px',
                                        }}
                                    >
                                        站内信横幅
                                    </Checkbox>
                                </Col>
                                <Col span={8}>
                                    <Checkbox
                                        value="3"
                                        style={{
                                            lineHeight: '32px',
                                        }}
                                    >
                                        短信
                                    </Checkbox>
                                </Col>
                            </Row>
                        </Checkbox.Group>
                    </Form.Item>




                    <Form.Item
                        wrapperCol={{
                            span: 12,
                            offset: 6,
                        }}
                    >
                        <Button type="primary" htmlType="submit">
                            Submit
                        </Button>
                    </Form.Item>
                </Form>
            </Modal >
        );
    }
}
